<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Markdown官方教程</title>
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <header>
        <div class="head-left">
            <div class="listbox" id="listaside">
                <img src="./img/menu.png">
            </div>
            <p>Markdown <span>官方教程</span></p>
        </div>
        <div class="search-box">
            <img src="./img/search.png" alt="">
        </div>
    </header>
    <hr>
    <nav>
        <div class="logobox"><img src="./img/hero.png"></div>
        <p class="p1">
            Markdown 官方教程
        </p>
        <p class="p2">

            Markdown 是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档，Markdown文件的后缀名便是“.md”。

        </p>
        <button>Quick Start →</button>
    </nav>
    <hr>
    <section>
        <dl>
            <dt>掌握诀窍</dt>
            <dd>
                现在开始就参考 [入门指南] 学习 Markdown 的使用吧。本指南是为所有人（即便是新手）编写的。
            </dd>

            <dt>深入探讨 Markdown 语法</dt>
            <dd>
                无论你是 Markdown 新手还是经验丰富的专业人士，都可以在 [基本语法] 章节找到有关 Markdown 格式的所有答案。
            </dd>

            <dt>再上一个台阶</dt>
            <dd>
                通过使用 Markdown 的 [扩展语法] 来创建表格、代码块、自动链接等，让你的 Markdown 文档更加出色。
            </dd>
        </dl>
    </section>
    <hr>
    <footer>
        
    <p>Made by mrknight with ❤️</p>
  
    </footer>

    <aside id="aside">
        
            <p>入门</p>
            <p>速查表</p>
            <p>基本语法</p>
            <p>扩展语法</p>
            <p>工具</p>
            <p>在线编辑器</p>
            <p>标准</p>
       
        
    </aside>
    <script src="./js/index.js"></script>
</body>

</html>